.hx-login-copyright{
  color: #eee;
  width: 100%;
  position: fixed;
  bottom: 30px;
  text-align: center;
  }
  
.hx-login-container{
  background-color: #f0f2f5;
  display: flex;
  align-items: center;
  position: relative;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  background: url("/img/bg/bg1.jpg");
}
.hx-login-weaper {
  position: relative;
  margin: 0 auto;
  width: 450px;
  padding: 0 40px;
  box-sizing: border-box;
  box-shadow: 0 7px 25px rgba(0, 0, 0, 0.08);
  background-color: #fff;
  border-radius: 3px;
  animation: myfirst 1.5s;
  -webkit-animation: myfirst 1.5s; /* Safari 与 Chrome */
}
.hx-login-border {
  border-left: none;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  color: #fff;
  background-color: #fff;
  width: 100%;
  float: left;
  box-sizing: border-box;

}
.hx-login-main {
  margin: 0 auto;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
    h3 {
  margin-bottom: 20px;
    }
  p {
  color: #76838f;
  }
  
}
.hx-login-left,
.hx-login-border {
  padding-top: 20px;
  position: relative;
  align-items: center;
  display: flex;
}
.hx-login-title {
  color: #409eff;
  text-align: center;
  font-weight: 700;
  font-size: 20px;
}
@keyframes myfirst
{
    0%   { right:-37vw; top:-35vh; transform:rotate(120deg);
      -ms-transform:rotate(120deg); /* Internet Explorer */
      -moz-transform:rotate(120deg); /* Firefox */
      -webkit-transform:rotate(120deg); /* Safari 和 Chrome */
      -o-transform:rotate(120deg); /* Opera */  ;}
    100% { right:0px; top:0px;}
}
 
@-webkit-keyframes myfirst /* Safari 与 Chrome */
{
    0%   { right:-800px; top:-500px;}
    100% { right:0px; top:0px;}
}